//filter by keyword
$('#keyword').on('keyup',function(e){
    var word=$(this).val().toLowerCase();
    if(e.keyCode==13){
        UpdateUrlParam('keyword',word);
    }else{
        $('.question-item').hide()
       $('.question-item').each(function(i,ele){
           var text=$(ele).text().toLowerCase();
           if(text.indexOf(word)>-1){
               $(ele).show();
           }
       })
    }
});

//space
$('.spaces-item').on('click',function(){
    var space=$(this).text();
    UpdateUrlParam('space',space);
});

var tpl=`
<div class="list-group-item list-group-item-action">
 <p>
   <span class="answer-name">{{uname}}</span>
    <small class="answer-time">{{time}}</small>
 </p>
 <div class="answer-content">
     {{content}}
 </div>
</div>`;


var answerForm=`
  <div class="answer-form">
        <div class="error-answer-info alert alert-danger" role='alert'></div>
        <div class="form-group">
        <label for="textarea">Answer</label>
        <textarea class="form-control" id="textarea" name="answer" rows="5"></textarea>
        </div>
        <button class="btn btn-primary btn-answer-submit" data-qid={{qid}}>submit</button>
</div>
`
//answers
$('.small-answer').on('click',function(){
     var qid=$(this).data('qid');
    var isLogin=$('.user-info').length;
    if($(this).parent().find('.answers').is(":visible")){
        $(this).parent().find('.answers').hide()
    }else{
        $(this).parent().find('.answers').show();
        $(this).parent().siblings().find('.answers').hide();
    }
    var dom=$(this);
        $.ajax({
            url:'/answers',
            type:'GET',
            data:{
                qid:qid
            }
        }).done(function(res){
            if(res.success){
                 var answers=res.answers;
                var tplArr=[],t='';
                answers.forEach(item=>{
                    t=tpl.replace('{{uname}}',item.uname);
                    t=t.replace('{{time}}',item.time);
                    t=t.replace('{{content}}',item.content);
                    tplArr.push(t);
                });
                var html=tplArr.join('');
                if(isLogin){
                    var h=answerForm.replace('{{qid}}',qid)
                    html+=h;
                }
                dom.parent().find('.answers .list-group').html(html);
            }else{
                alert('get answers error')
            }
        }).fail(function(xhr){
            alert('get answers error')
        });
    
})


//show read more button
var defaultHeight=70;
$('.content-detail').each(function(i,ele){
    var height=$(ele).height();
    if(height>defaultHeight){
        $(ele).closest('.question-item').find('.read-more').show();
    }
});

//toggle show more text
$('body').on('click','.read-more',function(){
    var dom=$(this);
    if(dom.hasClass('expand')){
        dom.removeClass('expand');
        dom.closest('.question-item').find('.content').css({
            'max-height':""
        });
        dom.text('Read more')
    }else{
        dom.addClass('expand');
        dom.closest('.question-item').find('.content').css({
            "max-height":"initial"
        });
        dom.text('hide');
    }
})